<html>
<head>
    <meta charset="UTF-8">
    <style>
        table
        {
            border-collapse:collapse;
        }
       th, td
        {
            border: 1px solid black;
            height: 40px;
        }
    </style>

</head>
<body>
<center>
    <h3>订单页面</h3>
    <table>
        <tr>
            <th width="400">商品</th>
            <th width="100">金额</th>
            <th width="200"></th>
        </tr>
        <tr>
            <td><input id="productName" style="width: 100%;height: 100%" /></td>
            <td><input id="productAmount" style="width: 100%;height: 100%" /></td>
            <td style="text-align: center"><a id="createOrder" href="#" >下单</td>
        </tr>
    </table>
</center>
<script src="js/libs/jquery.js"></script>
<script>
    $("#createOrder").click((e) => {
        e.preventDefault();
        let productName = $('#productName').val();
        let productAmount = $('#productAmount').val();
        $.get(`/order/create?name=${productName}&amount=${productAmount}`, (data, status) =>  {
            localStorage.setItem("currentOrder", JSON.stringify(data));
            window.location.href = '/payment.html';

        });
    });
</script>
</body>
</html>